import React, { Component } from 'react';
import { Line } from '@ant-design/plots';
import "antd/dist/antd.css";
import "./style.scss";
import { connect } from "react-redux";

// const generateMockData = (count) => {
//   const data = [];
//   const currentDate = new Date();

//   for (let i = 0; i < count; i++) {
//     const date = new Date(currentDate.getTime() + i * 60 * 1000); // 每分钟增加一条数据
//     const time = `${date.getHours()}:${date.getMinutes()}`; // 格式化时间为小时:分钟
//     const errorCount = Math.floor(Math.random() * 10); // 随机生成错误次数（0-9）

//     data.push({ time, errorCount });
//   }

//   return data;
// };

class LineChart extends Component {
  render() {

    const { data, trendConfig } = this.props;


    const defaultData = [
      // { xfield: '2021-01-01', yfield: 10 },
      // { xfield: '2021-02-01', yfield: 20 },
      // { xfield: '2021-03-01', yfield: 15 },
      // 其他数据...
    ];

    const xAxisText = trendConfig !== void 0 ? trendConfig.xAxisText : '发生时间';
    const yAxisText = trendConfig !== void 0 ? trendConfig.yAxisText : '卡顿次数';

    const config = {
      data: data ? data : defaultData,
      padding: 'auto',
      xField: 'xField',
      yField: 'yField',
      xAxis: {
        title: {
          text: xAxisText,
        }
      },
      yAxis: {
        title: {
          text: yAxisText,
        }
      },
      meta: {
        xField: {
          alias: xAxisText,
        },
        yField: {
          alias: yAxisText,
        },
      },
      slider: {
        start: 0,
        end: 1
      },
      smooth: true,
      tooltip: { shared: true },
      // point: {
      //   size: 5,
      //   shape: 'diamond',
      //   style: {
      //     fill: 'white',
      //     stroke: '#2593fc',
      //     lineWidth: 2,
      //   },
      // }
    };

    return <Line {...config} />;
  }

}

function mapStateToProps(state) {
  return {
    pathname: state.router.location.pathname,
    search: state.router.location.search,
    hash: state.router.location.hash,
  }
}

export default connect(mapStateToProps)(LineChart);